<!DOCTYPE html>
<p class="ui-widget ui-widget-content" style="padding-left: 1em;">	
	<span>班级：</span>
	<select onchange="bjChange(this.value)" id="bjSel" style="border:1px #888 solid;">
		<option th:each="bj : ${classes}" th:value="${bj.id}" th:text="${bj.name}">1班</option>
	</select>
</p>
<table id="list2"></table>
<div id="pager2"></div>

<script type="text/javascript">
var options={
		url : 'student/list',
		caption : '学生列表',
		//width: '100%',
		editurl: 'student/edit',
		autowidth: true,
		height : 500,
		hidegrid: false,
		datatype : 'json',
		mtype : 'post',
		rowNum : 10,
		postData:{classId:[[${classId}]]},
		rowList : [10,20,50],
		prmNames: {search:"search"},
		sortname : 'id',
		viewrecords : true,
		pager : '#pager2',
		jsonReader : { 
			 repeatitems: false,
			 id : 'id'
		},
		colModel:[
			{label:'id',name:'id',index:'id',align:'center',sortable:true,width:50,sorttype:'int',search:false,hidden:true},
			/* {label:'班级',name:'tbClass.id',index:'tbClass.id',hidden:true,align:'center',sortable:true,width:50,sorttype:'int',search:false,editable:true}, */
			{label:'姓名',name:'name',index:'name',align:'center',sortable:true,width:100,editable:true,sorttype:'text',searchoptions:{sopt:['cn','eq']}},
			{label:'学号',name:'username',index:'username',align:'center',sortable:true,width:100,editable:true,sorttype:'text',searchoptions:{sopt:['cn','eq']}},
			{label:'密码',name:'password',index:'password',width:100,editable:true,edittype:'password',hidden:true,editrules:{edithidden:true}},
			{label:'性别',name:'sex',index:'sex',align:'center',sortable:false,width:100,editable:true,edittype:'select',editoptions:{value:{'男':'男','女':'女'}},stype:'select',searchoptions:{opt:['eq']}},
			{label:'职务',name:'job',index:'job',align:'center',sortable:true,width:80,editable:true,sorttype:'text'}
		]
	}
	$(function(){
		$('#list2').jqGrid(options);
		$("#list2").jqGrid('navGrid','#pager2',{edit:true,add:true,del:true},{
			left:200,
			top:50,
			beforeSubmit: function(postdata,formid){
				postdata['tbClass.id']=$('#bjSel').val();
				return [true,'OK!'];
			},
			closeAfterEdit:true,
			closeOnEscape:true,
			savekey:[true,13]
		},{
			left:200,
			top:50,
			beforeSubmit: function(postdata,formid){
				postdata.id='',
				postdata['tbClass.id']=$('#bjSel').val();
				return [true,'OK!'];
			},
			closeAfterAdd:true,
			closeOnEscape:true,
			savekey:[true,13]
		},{
			left:200,
			top:50,
			closeOnEscape:true
			
		},{
			left:200,
			top:50,
			closeAfterSearch:true,
			closeAftreReset:true,
			closeOnEscape:true,
			multipleSearch:true
		});
	});
	
	function bjChange(classId){
		var postdata={classId:classId};
		options.postData=postdata;
		$("#list2").setGridParam(options).trigger("reloadGrid");
	}
</script>
